﻿$().ready(function() {
    $('#treeview').treeview();
    $("#treeview span").bind("click", getItemDetails);
});

function getItemDetails(e) {
    debugger;
    var URL = window.location + "/GetItemDetails/" + this.className + "/" + this.id;
    var URLStudents = window.location + "/GetStudetnsForItem/" + this.className + "/" + this.id;
    $.getJSON(URL, function(data) {
        $("#ItemName")[0].innerHTML = data.Name;
        $("#Students")[0].innerHTML = "<table id='list' class='scroll' cellpadding='0' cellspacing='0'></table><div id='pager' class='scroll' style='text-align: center;'></div>";
        $("#list").jqGrid({
            url: URLStudents,
            datatype: 'json',
            myType: 'GET',
            colNames: ['Id', 'Faculty', 'Department', 'Group', 'FullName'],
            colModel: [
                         { name: 'Id', index: 'id', width: 55, resizable: true },
                         { name: 'Faculty', index: 'faculty', width: 90, resizable: true },
                         { name: 'Department', index: 'department', width: 90, resizable: true },
                         { name: 'Group', index: 'groupname', width: 90, resizable: true },
                         { name: 'FullName', index: 'fullname', width: 120, resizable: true}],
            pager: $('#pager'),
            rowNum: 10,
            rowList: [10, 20, 30],
            sortname: 'id',
            sortorder: 'desc',
            viewrecords: true,
            multiselect: false,
            imgpath: '../Image/jqGrid',
            caption: 'Students'
        });

    });
};